<template>
	<div id="loadingToast max" v-if="show">
		<div v-if="type=='loading'">
			<div class="weui-mask_transparent"></div>
			<div class="weui-toast my-weui-toast">
				<i class="weui-icon_toast weui-loading"></i>
				<p class="weui-toast__content" v-if="text">{{text}}</p>
			</div>
		</div>
		<div v-if="type=='text'">
			<div class="weui-mask_transparent"></div>
			<div class="weui-toast my-weui-toast" style="min-height: 0;">
				<p class="weui-toast__content" v-if="text" style="margin: 1rem 0;">{{text}}</p>
			</div>
		</div>
		<div v-if="type=='success'">
			<div class="weui-mask_transparent"></div>
			<div class="weui-toast my-weui-toast">
				<i class="weui-icon-success weui-icon_msg weui-icon_toast"></i>
				<p class="weui-toast__content" v-if="text">{{text}}</p>
			</div>
		</div>
		<div v-if="type=='cancel'">
			<div class="weui-mask_transparent"></div>
			<div class="weui-toast my-weui-toast">
				<i class="weui-icon-cancel weui-icon_msg weui-icon_toast"></i>
				<p class="weui-toast__content" v-if="text">{{text}}</p>
			</div>
		</div>
		<div v-if="type=='forbidden'">
			<div class="weui-mask_transparent"></div>
			<div class="weui-toast my-weui-toast">
				<i class="weui-icon-warn weui-icon_msg weui-icon_toast"></i>
				<p class="weui-toast__content" v-if="text">{{text}}</p>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		props: {
			text: {
				type: String,
				default: ''
			},
			type: {
				type: String,
				default: 'success'
			},
			show: Boolean
		}
	};
</script>

<style>
	.weui-icon_toast.weui-loading {
		margin: 3.2rem 0 0;
		width: 3.8rem;
		height: 3.8rem;
		vertical-align: baseline;
	}
</style>
